// import logo from './logo.svg';
// import './App.css';

// function App() {
//   return (
//     <div className="App">
//       <header className="App-header">
//         <img src={logo} className="App-logo" alt="logo" />
//         <p>
//           Edit <code>src/App.js</code> and save to reload.
//         </p>
//         <a
//           className="App-link"
//           href="https://reactjs.org"
//           target="_blank"
//           rel="noopener noreferrer"
//         >
//           Learn React
//         </a>
//       </header>
//     </div>
//   );
// }

// export default App;

import React from 'react';
import * as Pages from './pages';
import { BrowserRouter as Router } from 'react-router-dom';
import './App.css';
// import 'animate.css';
// import { CSSTransition } from 'react-transition-group';
import TransitionRoute from './TransitionRoute';

export default function App() {
  return (
    <div className='main'>
      <Router>
        <Pages.NavBar></Pages.NavBar>
        <div className="page-container">
          <TransitionRoute path='/' exact component={Pages.Home} />
          <TransitionRoute path='/news' exact component={Pages.News} />
          <TransitionRoute path='/personal' exact component={Pages.Personal} />
        </div>
      </Router>
    </div>
  )
}
